<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <title>添加或编辑界面</title>
    <link rel="stylesheet" type="text/css" href="${s.base}/lib/layui/css/layui.css"/>
    <link rel="stylesheet" type="text/css" href="${s.base}/css/base/index.css"/>
    <link rel="stylesheet" type="text/css" href="${s.base}/css/base/theme/theme.css"/>
    <style>
        .layui-input-inline {
            width: 100%;
            height: 40px;
            line-height: 40px;
        }

        table tr td .layui-form-select dl {
            top: 40px;
            min-width: calc(100% + 20px);
            left: -10px;
        }
    </style>
</head>
<body>
<div class="page-content-wrap clearfix">
    <form class="layui-form" id="tool">
        <div class="layui-tab">
            <div class="layui-tab-content" style="width: 960px; margin: 0 auto">
                <div class="cyt-step" style="width:400px;margin:0 auto 30px auto;">
                    <div class="cyt-step-li cyt-step-li-on">
                        <span>1</span>
                        基础信息
                    </div>
                    <div class="cyt-step-li">
                        <span>2</span>
                        分班信息
                    </div>
                </div>
                <div id="step1">
                    <div class="div-tit-top border0" style="margin-bottom:0px"><span></span>基本信息</div>
                    <table cellpadding="0" cellspacing="0" class="wxyy-item-table marb20" width="100%">
                        <td><span class="red">*</span>任务名称：</td>
                        <td>
                            <input type="text" name="title" id="title" value="${divideClass.title}"
                                   lay-verify="required" placeholder="请输入" class="layui-input wxyy-tab-input"
                                   maxlength="30" autocomplete="off">
                        </td>
                        <td><span class="red">*</span>分班学段</td>
                        <td>
                            <div class="layui-input-inline">
                                <select name="divideType" id="divideType" lay-verify="required"></select>
                            </div>
                        </td>
                    </table>
                    <div class="layui-form-item">
                        <div class="layui-input-block" style="margin-left: 0px !important;text-align: center">
                            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="next1">下一步
                            </button>
                            <button type="button" id="cancel1" class="layui-btn layui-btn-primary">取消</button>

                        </div>
                    </div>
                </div>
                <div id="step2" style="display: none">
                    <div class="div-tit-top" style="margin-bottom:10px"><span></span>信息导入</div>
                    <button class="layui-btn layui-btn-normal layui-btn-mid" type="button"
                            id="import"><i class="iconfont marr5">&#xe612;</i>批量导入
                    </button>
                    <div class="layui-form mart10" id="table-list">
                        <table id="entityList" lay-filter="entityList" class="cy-list-table"></table>
                    </div>
                    <div class="layui-form-item mart20">
                        <div class="layui-input-block" style="margin-left: 0px !important;text-align: center">
                            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="next2">下一步
                            </button>
                            <button type="button" id="cancel2" class="layui-btn layui-btn-primary">取消</button>

                        </div>
                    </div>
                </div>
                <div id="step3" style="display:none">
                    <div class="div-tit-top border0" style="margin-bottom:0px"><span></span>条件设置</div>
                    <table cellpadding="0" cellspacing="0" class="wxyy-item-table marb20" width="100%">
                        <td>班级数量设置：</td>
                        <td colspan="3">
                            <input type="text" name="classNum" value="${divideClassRule.classNum}" id="classNum"
                                   placeholder="请输入"
                                   class="layui-input wxyy-tab-input" maxlength="30" autocomplete="off"
                            >
                        </td>
                    </table>
                    <table cellpadding="0" cellspacing="0" class="wxyy-item-table marb20" width="100%" id="class">
                        <#if (divideClassClassList??) && (divideClassClassList?size > 0)>
                            <#list divideClassClassList as divideClassClass>
                                <tr>
                                    <td><input hidden name="className" value="${divideClassClass.name}">${divideClassClass.name}
                                    </td>
                                    <td style="width:313px!important">
                                        <input type="text" name="num" value="${divideClassClass.num}" placeholder="请输入"
                                               class="layui-input wxyy-tab-input"
                                               maxlength="30" autocomplete="off">
                                    </td>
                                    <td>班主任：</td>
                                    <td class="wxyy-td-tetxleft">
                                        <div class="kw-grade-dr" onclick="chooseUser(this)" style="line-height:40px;">
                                            <input type="hidden" class="wxyy-tab-input" name="jkIds"
                                                   value="${divideClassClass.headTeacher}">
                                            <input type="hidden" class="wxyy-tab-input"
                                                   name="jkUserNumber"
                                                   placeholder="请选择监考老师">
                                            <span type="text" class="personlist" name="jkName" autocomplete="off">${divideClassClass.headTeacherName}</span>
                                            <div class="righticon"><i class="iconfont">&#xe6fb;</i></div>
                                        </div>
                                    </td>
                                </tr>
                            </#list>
                        </#if>
                    </table>
                    <div style="border:1px solid #ddd;padding:10px 20px;">
                        <div class="div-checkbox-line">
                            <input type="checkbox" value="0" id="isScore" name="isScore" title="总分均衡" lay-skin="primary"
                                   lay-filter="tjsz">
                            <div class="wc" id="totalError1" name="totalError" style="display: none;">总分误差<span
                                    class="iconfont">&#xe73a;</span><input id="totalError"
                                    type="text" value="${divideClassRule.totalError}" autocomplete="off"></div>
                        </div>
                        <div class="div-checkbox-line">
                            <input type="checkbox" value="1" id="isRank" name="isRank" title="排名均衡（按男女成绩排名循环分配）"
                                   lay-skin="primary"
                                   lay-filter="tjsz">
                        </div>
                        <div class="div-checkbox-line">
                            <input type="checkbox" value="2" id="isSex" name="isSex" title="性别均衡" lay-skin="primary"
                                   lay-filter="tjsz">
                        </div>
                    </div>
                    <div id="drcjbar" style="display:none;">
                        <div class="div-tit-top border0 mart20" style="margin-bottom:0px"><span></span>导入成绩</div>
                        <div style="border:1px solid #ddd;padding:10px 20px;">
                            <button class="layui-btn layui-btn-normal layui-btn-mid" type="button"
                                    id="selectFile"><i class="iconfont marr5">&#xe612;</i>导入
                            </button>
                            <div class="layui-form mart10" id="table-list1">
                                <table id="entityList1" lay-filter="entityList" class="cy-list-table"></table>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item mart30">
                        <div class="layui-input-block" style="margin-left: 0px !important;text-align: center">
                            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="submitBtn">开始分班</button>
                            <button class="layui-btn layui-btn-normal" type="button" id="saveBtnNew">保存</button>
                            <button type="button" id="cancel" class="layui-btn layui-btn-primary">取消</button>
                            <button type="button" style="display: none;" id="save"
                                    class="layui-btn layui-btn-primary"></button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>
<script src="${s.base}/lib/layui/layui.js" type="text/javascript" charset="utf-8"></script>
<script src="${s.base}/js/common.js" type="text/javascript" charset="utf-8"></script>
<script>
    var divideId = '${divideClass.id}';
    var applyId = '${applyId}';
    var menuId = '${parentMenuId}';
    var divideNum = parseInt('${divideNum}');
    var divideType='${divideClass.divideType}';
    var ruleId = '${divideClassRule.id}';
    layui.use(['jquery', 'form', 'baseutil', 'page', 'table', 'dialog', 'upload'], function () {
        var $ = layui.jquery,
            form = layui.form,
            page = layui.page,
            table = layui.table,
            dialog = layui.dialog,
            upload = layui.upload,
            baseutil = layui.baseutil;
        page.initDict('divideType,sexType', function (dictData) {
            page.showDict($("#divideType"), page.aceeptDictContentList(dictData, 'divideType'), "请选择", '${divideClass.divideType}');
        });
        //监听提交
        form.on('submit(submitNextBtn)', function (data) {
            $("#jxxx").hide();
            $("#fbsz").show();
            $(".cyt-step .cyt-step-li").removeClass("cyt-step-li-on")
            $(".cyt-step .cyt-step-li:eq(1)").addClass("cyt-step-li-on")
        });
        form.on('checkbox(tjsz)', function (data) {
            var fbclass = [];
            $('input[type=checkbox]:checked').each(function () {
                var vaID = $(this).val();
                fbclass.push(vaID);
            });
            var vlaueID = $.inArray("2", fbclass);
            var wcID = $.inArray("0", fbclass);
            if (vlaueID != -1 && fbclass.length == 1) {
                $("#drcjbar").hide();
                $(".wc").hide();
            }
            else if (fbclass.length < 1) {
                $("#drcjbar").hide();
                $(".wc").hide();
            }
            else {
                $("#drcjbar").show();
                if (wcID != -1) {
                    $(".wc").show();
                }
                else {
                    $(".wc").hide();
                }
            }

        });
        form.on('submit(submitBtn)', function (data) {
            var classArr = [];
            $("#class tr").each(function (obj) {
                obj = {};
                var name = $(this).find("input[name='className']").val();
                var num = $(this).find("input[name='num']").val();
                var headTeacher = $(this).find("input[name='jkIds']").val();
                obj.name = name;
                obj.num = num;
                obj.headTeacher = headTeacher;
                classArr.push(obj);
            });
            data.field.classNum = $("#classNum").val();
            data.field.totalError = $("#totalError").val();
            if ($("#isScore").is(":checked")) {
                data.field.isScore = '1';
            } else {
                data.field.isScore = '0';
            }
            if ($("#isSex").is(":checked")) {
                data.field.isSex = '1';
            } else {
                data.field.isSex = '0';
            }
            if ($("#isRank").is(":checked")) {
                data.field.isRank = '1';
            } else {
                data.field.isRank = '0';
            }
            data.field.classArr = JSON.stringify(classArr);
            data.field.id = ruleId;
            data.field.divideId=divideId;
            baseutil.post("/divideclass/divideclassrule/addOrUpdate", data.field, function (res) {
                if (res.code == '0') {
                    baseutil.post("/divideclass/divideclass/divideClass",{id:divideId}, function (re) {
                        if (re.code == '0') {
                            $("#save").click();
                            parent.tabRefresh(menuId);
                            parent.tabDelete('divideclasssEdit');
                        } else {
                            dialog.msg(re.msg);
                            return false;
                        }
                    });
                } else {
                    dialog.msg(res.msg);
                    return false;
                }
            });
            return false;
        });
        $("#saveBtnNew").bind('click', function (data) {
            var classArr = [];
            $("#class tr").each(function (obj) {
                obj = {};
                var name = $(this).find("input[name='className']").val();
                var num = $(this).find("input[name='num']").val();
                var headTeacher = $(this).find("input[name='jkIds']").val();
                obj.name = name;
                obj.num = num;
                obj.headTeacher = headTeacher;
                classArr.push(obj);
            });
            var classNum = $("#classNum").val();
            var totalError = $("#totalError").val();
            if ($("#isScore").is(":checked")) {
                var isScore = '1';
            } else {
                var isScore = '0';
            }
            if ($("#isSex").is(":checked")) {
                var isSex = '1';
            } else {
                var isSex = '0';
            }
            if ($("#isRank").is(":checked")) {
                var isRank = '1';
            } else {
                var isRank = '0';
            }
            var classArr = JSON.stringify(classArr);
            var data = {
                id: ruleId,
                classNum: classNum,
                totalError: totalError,
                isScore: isScore,
                isSex: isSex,
                isRank: isRank,
                classArr: classArr,
                divideId: divideId
            };
            baseutil.post("/divideclass/divideclassrule/addOrUpdate", data, function (res) {
                if (res.code == '0') {
                    $("#save").click();
                    parent.tabRefresh(menuId);
                    parent.tabDelete('divideclasssEdit');
                } else {
                    dialog.msg(res.msg);
                    return false;
                }
            });
            return false;
        });
        form.on('submit(next1)', function (data) {
            data.field.id = '${divideClass.id}';
            data.field.applyId = applyId;
            baseutil.post("/divideclass/divideclass/addOrUpdate", data.field, function (res) {
                divideId = res.data;
                $("#save").click();
                $("#step1").hide();
                $("#step2").show();
                //获取分页数据
                page.initDict('divideType,sexType', function (dictData) {
                    page.showDict($("#divideType"), page.aceeptDictContentList(dictData, 'divideType'), "请选择", '${divideClass.divideType}');
                    var url = "/divideclass/divideclassstudent/page?divideId=" + divideId;
                    var cols = [
                        {type: 'numbers', title: '序号'},
                        {field: 'xh', title: '学号', align: 'center'},
                        {field: 'name', title: '姓名', align: 'center'},
                        {
                            field: 'sex', title: '性别', align: 'center', templet: function (d) {
                            return page.aceeptDictContentName(dictData, 'sexType', d.sex);
                        }
                        },
                        {field: 'school', title: '来源学校', align: 'center'},
                    ];
                    tableIns = page.initDate(cols, url);
                });
            });
            return false;
        });
        $("#classNum").bind('blur', function () {
            var num = parseInt($("#classNum").val());
            var str = "";
            var className = "";
            var type = divideType;
            var classArr = new Array();
            var stuNum = parseInt(parseInt(divideNum) / parseInt(num));
            var duoYu = parseInt(divideNum) % parseInt(num);
            for (var i = 1; i <= num; i++) {
                classArr[i] = stuNum;
            }
            for (var i = 1; i <= duoYu; i++) {
                classArr[i] += 1;
            }
            if (type === '0') {
                className = "文科";
            } else if (type === '1') {
                className = "理科";
            } else if (type === '2') {
                className = "高一";
            } else if (type === '3') {
                className = "初一";
            } else if (type === '4') {
                className = "小学";
            }
            for (var i = 1; i <= num; i++) {
                str += ' <tr>\
                <td><input hidden name="className" value="' + className + '' + i + '班">' + className + '' + i + '班</td>\
                <td style="width:313px!important">\
                <input type="text" name="num" value="' + classArr[i] + '" placeholder="请输入" autocomplete="off" class="layui-input wxyy-tab-input"\
            maxlength="30">\
                </td>\
                <td>班主任：</td>\
            <td class="wxyy-td-tetxleft">\
                <div class="kw-grade-dr" onclick="chooseUser(this)" style="line-height:40px;">\
                <input type="hidden" class="wxyy-tab-input"  name="jkIds">\
                <input type="hidden" class="wxyy-tab-input"  name="jkUserNumber"\
            placeholder="请选择监考老师">\
                <span type="text" class="personlist" name="jkName" autocomplete="off"></span>\
                <div class="righticon"><i class="iconfont">&#xe6fb;</i></div>\
            </div>\
            </td>\
            </tr>';
            }
            $("#class").html(str);
        });
        $("#selectFile").bind('click', function () {
            dialog.popUpPage('批量导入学生成绩信息', '/base/import?url=/divideclass/divideclass/importExcel?divideId=' + divideId + '&applyId=' + applyId + '&download=/upload/DivideClassGradeInfo.xlsx', "500px", "400px", function (layer, index) {
                var body = layer.getChildFrame('body', index);
                body.find("#save").bind("click", function (res) {
                    parent.layer.closeAll();
                    page.initDict('divideType,sexType', function (dictData) {
                        page.showDict($("#divideType"), page.aceeptDictContentList(dictData, 'divideType'), "请选择", '${divideClass.divideType}');
                        var url = "/divideclassGrade/divideclassgrade/page?divideId=" + divideId;
                        if(divideType==='4'){
                            var cols = [
                                {type: 'numbers', title: '序号'},
                                {field: 'xh', title: '学号', align: 'center'},
                                {field: 'name', title: '姓名', align: 'center'},
                                {field: 'chinese', title: '语文', align: 'center'},
                                {field: 'math', title: '数学', align: 'center'},
                                {field: 'english', title: '英语', align: 'center'}
                            ];
                        }else{
                            var cols = [
                                {type: 'numbers', title: '序号'},
                                {field: 'xh', title: '学号', align: 'center'},
                                {field: 'name', title: '姓名', align: 'center'},
                                {field: 'chinese', title: '语文', align: 'center'},
                                {field: 'math', title: '数学', align: 'center'},
                                {field: 'english', title: '英语', align: 'center'},
                                {field: 'political', title: '政治', align: 'center'},
                                {field: 'history', title: '历史', align: 'center'},
                                {field: 'geography', title: '地理', align: 'center'},
                                {field: 'physical', title: '物理', align: 'center'},
                                {field: 'chemistry', title: '化学', align: 'center'},
                                {field: 'biological', title: '生物', align: 'center'}
                            ];
                        }
                        tableIns = page.newInitDate("entityList1",cols, url);
                    });
                    dialog.msg("导入学生成绩成功！");
                });
                body.find("#cancel").bind("click", function () {
                    parent.layer.closeAll();
                });
            });
        });
        form.on('submit(next2)', function () {
            $("#step1").hide();
            $("#step2").hide();
            $("#step3").show();
            checkStatus();
            page.initDict('divideType,sexType', function (dictData) {
                page.showDict($("#divideType"), page.aceeptDictContentList(dictData, 'divideType'), "请选择", '${divideClass.divideType}');
                var url = "/divideclassGrade/divideclassgrade/page?divideId=" + divideId;
                if(divideType==='4'){
                    var cols = [
                        {type: 'numbers', title: '序号'},
                        {field: 'xh', title: '学号', align: 'center'},
                        {field: 'name', title: '姓名', align: 'center'},
                        {field: 'chinese', title: '语文', align: 'center'},
                        {field: 'math', title: '数学', align: 'center'},
                        {field: 'english', title: '英语', align: 'center'}
                    ];
                }else{
                    var cols = [
                        {type: 'numbers', title: '序号'},
                        {field: 'xh', title: '学号', align: 'center'},
                        {field: 'name', title: '姓名', align: 'center'},
                        {field: 'chinese', title: '语文', align: 'center'},
                        {field: 'math', title: '数学', align: 'center'},
                        {field: 'english', title: '英语', align: 'center'},
                        {field: 'political', title: '政治', align: 'center'},
                        {field: 'history', title: '历史', align: 'center'},
                        {field: 'geography', title: '地理', align: 'center'},
                        {field: 'physical', title: '物理', align: 'center'},
                        {field: 'chemistry', title: '化学', align: 'center'},
                        {field: 'biological', title: '生物', align: 'center'}
                    ];
                }
                tableIns = page.newInitDate("entityList1",cols, url);
            });
            $(".cyt-step .cyt-step-li").removeClass("cyt-step-li-on");
            $(".cyt-step .cyt-step-li:eq(1)").addClass("cyt-step-li-on");
            return false;
        });
        $("#cancel1").bind('click', function () {
            parent.tabRefresh(menuId);
            parent.tabDelete('divideclasssEdit');
        });
        $("#cancel2").bind('click', function () {
            parent.tabRefresh(menuId);
            parent.tabDelete('divideclasssEdit');
        });
        $("#cancel").bind('click', function () {
            parent.tabRefresh(menuId);
            parent.tabDelete('divideclasssEdit');
        });
        $("#import").bind('click', function () {
            dialog.popUpPage('批量导入学生信息', '/base/import?url=/divideclass/divideclassstudent/importData?divideId=' + divideId + '&applyId=' + applyId + '&download=/upload/DivideClassInfo.xlsx', "500px", "400px", function (layer, index) {
                var body = layer.getChildFrame('body', index);
                body.find("#save").bind("click", function () {
                    parent.layer.closeAll();
                    baseutil.post('/divideclass/divideclass/getDivide', {"id":divideId}, function (result) {
                        if (result.code == 0) {
                            //招新内容
                            var data = result.data;
                            divideNum=data.divideNum;
                            divideType=data.divideType;
                            $("#step1").hide();
                            $("#step2").show();
                            //获取分页数据
                            page.initDict('divideType,sexType', function (dictData) {
                                page.showDict($("#divideType"), page.aceeptDictContentList(dictData, 'divideType'), "请选择", '${divideClass.divideType}');
                                var url = "/divideclass/divideclassstudent/page?divideId=" + divideId;
                                var cols = [
                                    {type: 'numbers', title: '序号'},
                                    {field: 'xh', title: '学号', align: 'center'},
                                    {field: 'name', title: '姓名', align: 'center'},
                                    {
                                        field: 'sex', title: '性别', align: 'center', templet: function (d) {
                                        return page.aceeptDictContentName(dictData, 'sexType', d.sex);
                                    }
                                    },
                                    {field: 'school', title: '来源学校', align: 'center'}
                                ];
                                tableIns = page.initDate(cols, url);
                            });
                        } else {
                            dialog.msg("数据有误，请联系管理员！");
                        }
                    });
                });
                body.find("#cancel").bind("click", function () {
                    parent.layer.closeAll();
                });
            });
        });
    });
    function chooseUser(obj) {
        layui.use(['jquery', 'form', 'baseutil', 'page', 'table', 'dialog'], function () {
            var dialog = layui.dialog;
            var string = obj.children[0].value;
            dialog.popUpScTeacherApplyMultSelect("jkIds", "jkName", "教师选择", string, function (id, name) {
                obj.children[0].value = id;
                obj.children[2].textContent = name;
            });
        });
    }
    function checkStatus() {
        if ('${divideClassRule.isScore}' === '1') {
            $("#isScore").prop("checked", true);
            $("#totalError1").show();
            $("#drcjbar").show();
        }
        if ('${divideClassRule.isRank}' === '1') {
            $("#isRank").prop("checked", true);
            $("#drcjbar").show();
        }
        if ('${divideClassRule.isSex}' === '1') {
            $("#isSex").prop("checked", true);
        }
        layui.form.render();
    }
</script>
</body>
</html>